<template>
  <div class="content-view">
    <assist-mgt :data="data" v-if="data.id== 'base_assist'" />
    <operator-mgt :data="data" v-if="data.id== 'base_operator'" />
    <dev-type-mgt :data="data" v-if="data.id== 'base_devtype'" />
    <rom-mgt :data="data" v-if="data.id== 'base_rom'" />
    <board-mgt :data="data" v-if="data.id== 'base_board'" />
    <factory-mgt :data="data" v-if="data.id== 'base_factory'" />
  </div>
</template>

<script>
import { getCurrentInstance, onMounted, reactive, ref } from 'vue'
import AssistMgt from '../tab_content2/AssistMgt.vue'
import DevTypeMgt from '../tab_content2/DevTypeMgt.vue'
import OperatorMgt from '../tab_content2/OperatorMgt.vue'
import RomMgt from '../tab_content2/RomMgt.vue'
import BoardMgt from '../tab_content2/BoardMgt.vue'
import FactoryMgt from '../tab_content2/FactoryMgt.vue'
export default {
  components: { AssistMgt, DevTypeMgt, OperatorMgt, RomMgt, BoardMgt,FactoryMgt},
  props:['data'],
  setup(props,ctx) {
    const Global = getCurrentInstance().proxy
    let user = reactive({
      name: Global.$var.user.name,
      power: Global.$var.user.power,
      avatar: Global.$var.user.avatar,
      action: '',
    })
    // console.log(props.data.id)
    onMounted(()=>{
      // init()
    })

    let DEV_TABLE = ref(null)
    let devList = ref([])
    let devInfo = ref({name: ''})
    let keyWord = ref('')
    function init() {
      user.action = props.data.id
      let md = mData.deviceData
      devList.value = md
    }
    // 多选选中
    let devSln = reactive({
      sns: [],
      proIds: [],
      devTypes: [],
      clients: [],
      name: '',
      title: '',
    })
    function handleSelectionChange(e) {
      let _sns = [],_proIds = [],_devTypes = [],_clients = []
      for(let i in e) {
        _sns.push(e[i].sn)
        _proIds.push(e[i].proId)
        _devTypes.push(e[i].devType)
        _clients.push(e[i].client)
      }
      devSln.sns = util.distinctArr(_sns)
      devSln.proIds = util.distinctArr(_proIds)
      devSln.devTypes = util.distinctArr(_devTypes)
      devSln.clients = util.distinctArr(_clients)
    }
    let OPER_DLG = ref(null)
    // 功能操作
    let devHandles = ref(Global.$const.DEV_HANDLE)
    let DEV_DETAIL = ref(null)
    let CLIENT_DLG = ref(null)
    function handleBtn(index,row,f) {
      //console.log(index, row)
      if (typeof(row) == 'object') devInfo.value = row
      setTimeout(() => {
        if (f == 'detail') {
          DEV_DETAIL.value.open()
        } 
        if (f == 'edit') {
          CLIENT_DLG.value.open()
        }
        if (f.indexOf('btn_')>=0) {
          devSln.name = f
          devSln.title = row
          if (devSln.sns.length <= 0) { 
            ElNotification({
              type: 'warning',
              title: '记录为空',
              message: '请先选择记录',
              duration: 1500,
            })
      
          } else OPER_DLG.value.open()
        }
      }, 1);
    }

    // 分页
    let pageInfo = reactive({
      total: 1000,
      index: 1,
      size: 10,
      sizeOptions: [
        {value: 10, label: '10条/页', disabled: true},
        {value: 50, label: '50条/页', disabled: false},
        {value: 100, label: '100条/页', disabled: false},
        {value: 500, label: '500条/页', disabled: false},
      ]
    })

    function pageChange(val) {
    //console.log(`当前页: ${val}`)
      ElNotification({
        message: `当前页: ${val}`,
        duration: 1500,
        type: 'info'
      })
      pageInfo.index = val
    }

    return{
      user, DEV_TABLE, devList, handleSelectionChange, devSln, OPER_DLG, keyWord,
      devHandles, handleBtn, devInfo, DEV_DETAIL, CLIENT_DLG,
      pageInfo, pageChange
    }
  },
}
</script>

<style lang="scss" scoped src="./tab_content.scss"></style>